<!--
    group: 企业管理
    name: 开票员管理
    url: /enterprise/invoiceIssuerManage
-->
<template>
  <div class="main_content">
    <h3>开票员管理</h3>

    <a-tabs default-active-key="1" v-model="activeKey" @change="callback" type="card">
      <a-tab-pane v-for="(item,index) in astList" :key="item.key">
        <span slot="tab">
          {{ item.title }}
        </span>
        <InvoiceIssuerItem v-if="activeKey == item.key" :key="timer" :tabNum="item.tabNum" :type="item.id" />
      </a-tab-pane>

      <a-button v-has="`qsb_kpylb:view:add`" @click="addInvoiceUser" slot="tabBarExtraContent" type="primary" class="mLeft">新增开票员</a-button>
    </a-tabs>
  </div>
</template>

<script>
import InvoiceIssuerItem from '@views/enterprise/invoiceIssuer/invoiceIssuerItem.vue'
let astList = [
  {
    key: '1',
    id: '1',
    num: 0,
    title: '按开票员展示',
    tabNum:'1', // 用于按钮授权
  },
  {
    key: '2',
    id: '2',
    num: 0,
    title: '按企业展示',
    tabNum:'2', // 用于按钮授权
  },
];
export default {
  name: 'invoiceIssuerManage',
  components: { InvoiceIssuerItem },
  data(){
    return{
      astList,
      activeKey: astList[0].key,
      timer:null,
    }
  },
  mounted() {
    this.showtabs();//跳转到指定tab
  },
  methods:{
    callback(key){
      this.timer = new Date().getTime();
    },
    showtabs(){
      if (this.$route.query.pagetab){
        this.activeKey = this.$route.query.pagetab;
      }
    },
    //新增开票员
    addInvoiceUser(){
      this.$router.push({
        path: '/enterprise/invoiceIssuerAdd'
      })
    },
  }
}
</script>

<style scoped lang="less">
.main_content{
  color: @color-smudge;
}
h3,h4{
  font-weight: bolder;
}
h3{
  font-size: 20px;
  margin-bottom: 30px;
}
</style>
